<template>
  <div style="padding: 0 15px">
    <svg
      xmlns="http://www.w3.org/2000/svg"
      xmlns:xlink="http://www.w3.org/1999/xlink"
      width="16"
      height="16"
      viewBox="0 0 16 16"
      fill="none"
    >
      <path
        :fill="topNav?(!theme.includes('2e3c56')? 'rgba(44, 78, 120, 1)' : '#fff'):(!topTheme.includes('2e3c56')? 'rgba(44, 78, 120, 1)' : '#fff')"
        d="M2.66683 2.00016L2.66683 13.3335L14.0002 13.3335C14.044 13.3335 14.0873 13.3377 14.1303 13.3463C14.1732 13.3549 14.2149 13.3675 14.2553 13.3843C14.2957 13.401 14.3342 13.4215 14.3706 13.4459C14.407 13.4702 14.4406 13.4978 14.4716 13.5288C14.5025 13.5597 14.5301 13.5934 14.5545 13.6298C14.5788 13.6662 14.5993 13.7046 14.6161 13.7451C14.6328 13.7855 14.6455 13.8271 14.6541 13.8701C14.6626 13.913 14.6669 13.9564 14.6669 14.0002C14.6669 14.044 14.6626 14.0873 14.6541 14.1303C14.6455 14.1732 14.6328 14.2149 14.6161 14.2553C14.5993 14.2957 14.5788 14.3342 14.5545 14.3706C14.5301 14.407 14.5025 14.4406 14.4716 14.4716C14.4406 14.5025 14.407 14.5301 14.3706 14.5545C14.3342 14.5788 14.2957 14.5993 14.2553 14.6161C14.2149 14.6328 14.1732 14.6455 14.1303 14.6541C14.0873 14.6626 14.044 14.6669 14.0002 14.6669L2.00016 14.6669C1.63197 14.6669 1.3335 14.3684 1.3335 14.0002L1.3335 2.00016C1.3335 1.95639 1.33777 1.91304 1.34631 1.8701C1.35485 1.82717 1.36749 1.78548 1.38424 1.74504C1.401 1.7046 1.42153 1.66618 1.44585 1.62978C1.47017 1.59339 1.49781 1.55971 1.52876 1.52876C1.55971 1.49781 1.59339 1.47017 1.62978 1.44585C1.66618 1.42153 1.7046 1.401 1.74504 1.38424C1.78548 1.36749 1.82717 1.35485 1.8701 1.34631C1.91304 1.33777 1.95639 1.3335 2.00016 1.3335C2.04394 1.3335 2.08729 1.33777 2.13022 1.34631C2.17316 1.35485 2.21484 1.36749 2.25529 1.38424C2.29573 1.401 2.33415 1.42153 2.37055 1.44585C2.40694 1.47017 2.44062 1.49781 2.47157 1.52876C2.50252 1.55971 2.53016 1.59339 2.55448 1.62978C2.5788 1.66618 2.59934 1.7046 2.61609 1.74504C2.63284 1.78548 2.64548 1.82717 2.65402 1.8701C2.66256 1.91304 2.66683 1.95639 2.66683 2.00016ZM6.65751 6.10146L4.08608 10.6729C3.99295 10.9496 3.99481 11.1707 4.09165 11.3363C4.1885 11.5019 4.38032 11.6119 4.66713 11.6664L13.6671 11.6664C14.0353 11.6664 14.3338 11.3679 14.3338 10.9997L14.3338 2.99973C14.3338 2.30636 13.4069 2.07372 13.0795 2.68491L10.2436 7.97858L7.65502 5.90772C7.33393 5.65084 6.85911 5.74306 6.65751 6.10146Z"
        fill-rule="evenodd"
        fill-opacity="0.8"
      ></path>
    </svg>
  </div>
</template>

<script setup>
import useSettingsStore from "@/store/modules/settings";

const settingsStore = useSettingsStore();
const topTheme = computed(() => settingsStore.topTheme);
const theme = computed(() => settingsStore.theme);
const topNav = computed(() => settingsStore.topNav);

defineProps({
  isActive: {
    type: Boolean,
    default: false,
  },
});

const emit = defineEmits();
// const toggleClick = () => {
//   emit('toggleClick');
// }
</script>

<style scoped>
.hamburger {
  display: inline-block;
  vertical-align: middle;
  width: 20px;
  height: 20px;
}

.hamburger.is-active {
  transform: rotate(180deg);
}
</style>
